
import styles from "@/components/rightcomp/rightother/index.less"
import { Anchor } from 'antd';


const { Link } = Anchor;

interface Iprops {
  toc: string;
}
const handleAnchorClick = (e: { preventDefault: () => void; }, link: any) => {
  e.preventDefault();
};
const ArticleDetailNav = (props: Iprops) => {
  const { toc } = props;
  let tocArr = toc ? JSON.parse(toc) : "";
  return <div  className={styles.floorBox}>
    <div className="head">目录</div>
      <div className="box">
        <Anchor onClick={handleAnchorClick} offsetTop={80} affix={false} style={{ height: "auto" }}>
          {
            tocArr ? tocArr.map((item: any) => {
              return <Link href={`#${item.id}`} title={item.text} className={`floor${item.level}`} key={item.id}></Link>
            }) : ""
          }
        </Anchor>
      </div>
  </div>
}

export default ArticleDetailNav;